<!DOCTYPE html>
<html>
<head>
	<title></title>
	<link rel="stylesheet" href="/assets/less/layui/css/layui.css"  media="all">
</head>
<body> 
<div class="layui-container">  
  <div class="layui-row">
    <div class="layui-col-xs12">
      <div class="layui-upload" style="text-align: center;">
		  	<button type="button" class="layui-btn" id="test1">上传图片</button>
		  	<div class="layui-upload-list">
		    	<img class="layui-upload-img" id="demo1">
		    	<p id="demoText"></p>
		  	</div>  
		</div>  
    </div>
  </div>
</div>

 
<script src="/assets/less/layui/layui.js" charset="utf-8"></script>
<script src="/assets/js/js.cookie.js" charset="utf-8"></script>
<script type="text/javascript">
	layui.use('upload', function(){
	  var $ = layui.jquery
	  ,upload = layui.upload;
	  
	  //普通图片上传
	  var uploadInst = upload.render({
	    elem: '#test1'
	    ,url: '/api/common/upload'
	    ,data:{
	    	token:'{$token}',
	    	trade_id:'{$trade_id}'
	    }
	    ,before: function(obj){
	      //预读本地文件示例，不支持ie8
	      obj.preview(function(index, file, result){
	        $('#demo1').attr('src', result); //图片链接（base64）
	      });
	    }
	    ,done: function(res, index, upload){
	      //如果上传失败
	      if(res.code = 0){
	        return layer.msg('上传失败');
	      }
	      console.log(res);
	      Cookies.set('{$type}', res.data.url);
	      return layer.msg('上传成功');
	      //上传成功
	    }
	    ,error: function(){
	      //演示失败状态，并实现重传
	    }
	  });
	});
</script>
</body>
</html>